<!-- edu_15_2_2.html -->
<!doctype html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <title>表单提交、重置事件的应用</title>
  <style type="text/css">
    fieldset {
      width: 300px;
      height: 150px;
    }
  </style>
  <script language="javascript" type="text/javascript">
    function $(id) { return document.getElementById(id); }
    function submitTest() {
      var msg = "用户名:" + $("input1").value;
      msg += "\n密码:是" + $("input2").value;
      alert(msg);
      return false;
    }
    function resetTest() { alert("将数据清空"); }
  </script>
</head>

<body>
  <form onsubmit="return submitTest();" onreset="resetTest()">
    <fieldset>
      <legend>表单数据提交</legend>
      <br><label>用户名：</label><input type="text" id="input1">
      <br><label>密&nbsp;码：</label><input type="password" id="input2">
      <br><input type="submit" value="提交">
      <input type="reset" value="重置">
    </fieldset>
  </form>
</body>

</html>